<template>
  <div id="app">
    <router-view></router-view>
    <Tab>
      <taBarItem path="/home" activeColor="blue">
        <img slot="slot-icon" src="./assets/img/tabbar/home.svg" alt="">
        <img slot="slot-icon-active" src="./assets/img/tabbar/home_active.svg" alt="">
        <div slot="slot-text">首页</div>
      </taBarItem>
      <taBarItem path="/category" activeColor="blue">
        <img slot="slot-icon" src="./assets/img/tabbar/category.svg" alt="">
        <img slot="slot-icon-active" src="./assets/img/tabbar/category_active.svg" alt="">
        <div slot="slot-text">分类</div>
      </taBarItem>
      <taBarItem path="/shop" activeColor="blue">
        <img slot="slot-icon" src="./assets/img/tabbar/shopcart.svg" alt="">
        <img slot="slot-icon-active" src="./assets/img/tabbar/shopcart_active.svg" alt="">
        <div slot="slot-text">购物车</div>
      </taBarItem>
    <taBarItem path="/me" activeColor="blue">
      <img slot="slot-icon" src="./assets/img/tabbar/profile.svg" alt="">
      <img slot="slot-icon-active" src="./assets/img/tabbar/profile_active.svg" alt="">
      <div slot="slot-text">我的</div>
    </taBarItem>
    </Tab>

  </div>
</template>
<script>
import Tab from './components/tabber/taBar'
import taBarItem from "./components/tabber/taBarItem";
export default {
    name: 'App',
    components:{
        Tab,
        taBarItem
    }
}
</script>
<style>
  @import "/assets/css/base.css";
</style>
